<template>
	<view class="app">
		<view class="app-1">
			<view class="">
				<text>99</text>
				<text>当前得分</text>
			</view>
			<view class="">
				<text>1</text>
				<text>当前排名</text>
			</view>
			<view class="">
				<text>99</text>
				<text>当前平均分</text>
			</view>
		</view>
		<view class="bank"></view>
		<view class="app-2">
			<view class="">
				<text>明细列表</text>
				<text></text>
			</view>
			<view class="list">
				<view v-for="(item, index) in 10" :key="index">
					<view class="">
						<text>疫情防控彰显大国精神</text>
						<text>联名提案重点提案</text>
					</view>
					<text>+85</text>
				</view>
			</view>
			<view class="loading-text">{{ loadingText }}</view>
		</view>
	</view>
</template>
<script>
export default {
	data() {
		return {
			page: 1,
			pageSize: 10,
			loadingText: '到底了......'
		};
	}
};
</script>

<style lang="scss">
.app-1 {
	display: flex;
	padding: 40upx 0;
	> view {
		flex: 1;
		text {
			display: block;
			text-align: center;
			font-size: 48upx;
			font-family: Source Han Sans CN;
			font-weight: 400;
			color: #333333;
			&:nth-child(2) {
				font-size: 24upx;
				color: #999;
				margin-top: 10upx;
			}
		}
		&:nth-child(2) {
			text {
				&:nth-child(1) {
					color: #f62c2c;
				}
			}
		}
	}
}
.bank {
	background: #f1f1f1;
	height: 20upx;
}
.app-2 {
	> view {
		&:nth-child(1) {
			padding: 40upx 0;
			text-align: center;
			text {
				display: block;
				&:nth-child(1) {
					font-size: 36upx;
					font-family: Source Han Sans CN;
					font-weight: 400;
					color: #333333;
				}
				&:nth-child(2) {
					width: 117upx;
					height: 6upx;
					background: #999999;
					opacity: 0.16;
					border-radius: 3upx;
					margin: 20upx auto 0;
				}
			}
		}
		&:nth-child(2){
			
		}
	}
}

.list{
	padding: 0 30upx;
	>view{
		display: flex;
		align-items: center;
		padding: 30upx 0;
		border-bottom: 1px solid #eee;
		&:last-child{
			border-bottom: 0;
		}
		view{
			flex: 1;
			margin-right: 50upx;
			text{
				display: block;
				&:nth-child(1){
					
					font-size: 28upx;
					font-family: PingFang SC;
					font-weight: bold;
					color: #333333;
				}
				&:nth-child(2){
					font-size: 22upx;
					font-family: PingFang SC;
					font-weight: 400;
					color: #BEBEBE;
					margin-top: 18upx;
				}
			}
		}
		>text{
			font-size: 48upx;
			font-family: PingFang SC;
			font-weight: 500;
			color: #F62C2C;
		}
	}
}
</style>
